import { ElMessage } from 'element-plus' // element-plus
import { pageDataApi } from '@/api/wenhua/bashen-api.js' // 文化API接口

export default {
  el: 'app',
  data() {
    return {
      pageTable: 0, // 显示界面（0:介绍。1:详情）
      /* 数据 */
      data: [], // 数据
      dataTotal: 0, // 数据条数
      /* 查询条件 */
      page: 1, // 页数
      pageSize: 10, // 每页条数
      queryData: '' // 查询条件
    }
  },
  watch: {
    queryData(val) {
      this.pageData() // 分页查询
    }
  },
  created() {
    this.pageData() // 分页查询
  },
  mounted() {
  },
  methods: {
    
    /**
     * 分页查询
     */
    pageData() {
      // 构造条件
      let query = {
        page: this.page, // 页数
        pageSize: this.pageSize, // 每页条数
        queryData: this.queryData // 查询条件
      }
      // 发送请求
      pageDataApi(query).then((res) => {
        if (String(res.data.code) === '200') {
          if (null !== res.data.data) {
            this.data = res.data.data.records // 数据
            this.dataTotal = res.data.data.total // 数据总条数
            // this.elMessage(3000, true, 'success', res.data.msg || '操作成功')
          } else {
            // this.elMessage(3000, true, 'error', res.data.msg || '操作失败')
          }
        } else {
          // this.elMessage(3000, true, 'error', res.data.msg || '操作失败')
        }
      }).catch(() => {
        this.elMessage(10000, true, 'warning', '网络连接已断开')
      })
    },

    /**
     * 查询数据高亮
     * 
     * @param {string} val 所要查询的数据
     */
    showDataMethod(val) {
      val = val + ''
      if (val.indexOf(this.queryData) !== -1 && this.queryData !== '') {
        return val.replace(this.queryData, '<font color="#409EFF">' + this.queryData + '</font>')
      } else {
        return val
      }
    },

    /**
     * 翻页
     */
    handleSizeChange(val) {
      this.pageSize = val; // 设置每页条数
      this.pageData(); // 分页查询
    },
    handleCurrentChange(val) {
      this.page = val; // 设置页数
      this.pageData(); // 分页查询
    },

    /**
     * 消息提示
     * 
     * @param {number} duration 显示时间（单位：毫秒）
     * @param {boolean} showClose 是否可关闭（true:是。false:否）
     * @param {string} type 消息类型（success、warning、error）
     * @param {string} message 提示内容
     */
    elMessage(duration, showClose, type, message) {
      ElMessage({
        duration: duration,
        showClose: showClose,
        type: type,
        message: message,
        plain: true
      })
    }

  }
}
